<template>
  <div
    v-if="top"
    class="flex text-16px font-400 leading-22px flex flex-col"
    :style="`padding:${py} 0`"
  >
    <label class="flex-1 text-#71747A">
      <slot name="label">{{ label }}:</slot>
    </label>
    <div class="flex-1 text-#1E2226 m-0 mt-6px break-all pre-wrap">
      <slot>{{ content }}</slot>
    </div>
  </div>
  <div v-else class="flex text-16px font-400 leading-22px" :style="`padding:${py} 0`">
    <label class="w-80px text-#71747A">
      <slot name="label">{{ label }}:</slot>
    </label>
    <div class="text-#1E2226 flex-1 m-0 break-all pre-wrap">
      <slot>{{ content }}</slot>
    </div>
  </div>
</template>

<script setup>
// 定义组件的属性
defineProps({
  label: {
    type: String,
    default: ''
  },
  top: {
    type: Boolean,
    default: false
  },
  content: {
    type: String,
    default: '--'
  },
  py: {
    type: String,
    default: '6px'
  }
})
</script>

<style scoped></style>
